超文本标记语言,标准通用标记语言下的一个应用。 “超文本”就是指页面内可以包含图片链接,甚至音乐程序等非文字元素。 超文本标记语言的结构包括“头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息,“主体”部分提供网页的具体内容。

下面是我以前创建的第一个HTML页面:

<!--    h5的文档声明,声明当前的网页是按照HTML5标准编写的 
    编写网页时一定要将H5的文档声明写在网页的最上边
    如果不写文档声明,则会导致有些浏览器进入一个怪异模式
    进入怪异模式后,浏览器解析页面时会导致页面无法正常显示,所以为了避免进入该模式,一定要写文档声明
-->
<!doctype html>
<!--    html根标签,一个页面中只有一个根标签,所有内容都应该写在根标签中-->
<html>
    <!-- head标签中的内容不会再网页中直接显示,是用来帮助浏览器解析页面的-->

    <head>
        <!-- title网页的标题标签,默认会显示在浏览器的标题栏中
             搜索引擎在搜索页面时,会首先检索title标签中的内容
             它是网页中对于搜索引擎来说最重要的内容,会影响页面在搜索引擎中的排名
        -->
        <!-- 需要告诉浏览器网页所采用的编码字符集
            meta标签用来设置网页的一些元数据,比如网页的字符集、简介、关键字
            meta是一个自结束标签,编写一个自结束标签时,可以在开始添加一个
        -->
        <meta charset="utf-8"/>
        <title> 网页标题 </title>

    </head>

    <!-- body标签用来设置主题内容,网页中所有可见的内容,都写在body中-->

    <body>
        <!--
            使用这个结构,可以进行注释
            我们可以通过编写注释,来帮助开发人员开发
            注释一定要简单明了
        -->

        <!--
             属性:可以通过属性来设置标签处理标签中的内容
            可以在开始标签中添加属性
            属性需要写在开始标签中,实际就是一个名值对结构
            属性名 = “属性值”,一个标签中可以使用多个属性,属性之间需要用空格隔开
         -->

        <h1>这是我的<font color="red" size="10">第一个</font>网页</h1>
    </body>

</html>

HTML常用标签

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>常用标签</title>
    </head>
    <body>
        <!--
            作者:951201193@qq.com
            时间:2018-05-07
            描述:标题标签
                在显示效果上h1最大,h6最小
                使用html标签时关心的是标签的语义,我们使用的标签都是语义化标签
                6级标题中,h1最重要,表示一个网页的主要内容,h2-h6的重要性依次降低
                对于搜索引擎来说,h1的重要性仅次于title,搜索引擎检索完title,会立即查看h1中的内容
                h1会影响到页面在搜索引擎中排名,页面只能写一个
                一般页面中的标签只写h1,h2,h3
        -->
        <h1>一级标签</h1>
        <h2>一级标签</h2>
        <h3>一级标签</h3>
        <h4>一级标签</h4>
        <h5>一级标签</h5>
        <h6>一级标签</h6>

        <!--
            作者:951201193@qq.com
            时间:2018-05-07
            描述:段落标签,用于表示内容中的一个自然段
                 使用p标签来表示一个段落
                 p标签中的文字默认独占一行,并且有行距
        -->
        <p>
            一个p标签,表示一个段落
        </p>
        <!--
            作者:951201193@qq.com
            时间:2018-05-07
            描述:在html中,字符之间写再多的空格,浏览器也会当成一个空格解析,换行也是一个空格
                 在页面中可以用br标签来换行,br标签是一个自结束标签
                 hr标签是一条水平线,也是一个自结束标签
        -->
        <p>
            窗前明月光 <br />
            疑是地上霜<hr />
        </p>
    </body>
</html>

HTML的语法规范

1.html中不区分大小写,但是我们一般都使用小写
2.html中的注释不能嵌套,注释里不能有注释
3.html中的标签必须结构完整,要么成对出现,要么自结束标签。
4.html的标签可以嵌套,但不能交叉嵌套
5.html标签中的属性必须有值,且值必须加引号

练习:

meta的介绍,建立一个5秒之后跳转为百度页面。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>meta的介绍</title>
        <!--
            作者:
            时间:2018-05-08
            描述:使用meta标签可以用来设置网页的关键字
                    name是对content的一个描述
        -->
        <meta name="keywords"  content="html5,javascript,前端"/>

        <!--
            作者:
            时间:2018-05-08
            描述:meta还可以指定网页的描述
                 搜索引擎在检索页面时,会同时检索页面的关键词和描述,但这两个都不会影响网页在搜索引擎中的排名
        -->
        <meta name="description"  content="发布h5、js前端等关键信息" >

        <!--
            作者:
            时间:2018-05-08
            描述:使用meta可以用来做请求的重定向
                    比如:5秒以后跳转页面
                    <meta http-equiv="refresh" content="秒数;url=网页地址(目标路径)"/>
        -->
        <meta http-equiv="refresh" content="5;url=https://www.baidu.com"/>

    </head>
    <body>
        <h1>5秒之后跳转页面</h1>
    </body>
</html>

一起学习,一起进步 -.- ,如有错误,可以发评论